<template>
    <div>
        <Header />
        <div class="resourceWrapper">
            <div class="bannerWrapper">
                <div class="topTitle">
                    最新资讯
                </div>
                <div class="mapNav">
                    <div class="indexContainer">
                        <el-breadcrumb separator-class="el-icon-arrow-right">
                            <el-breadcrumb-item :to="{ path: '/' }">首页</el-breadcrumb-item>
                            <el-breadcrumb-item>最新资讯</el-breadcrumb-item>
                        </el-breadcrumb>
                    </div>

                </div>
            </div>
            <div class="indexContainer">
                <div class="resContent">
                    <div class="h3Title">
                        <h3>最新资讯</h3>
                    </div>
                    <div class="newList" v-loading="loading">
                        <el-empty :image-size="100" v-if="newData.length==0"  description="暂无数据"></el-empty>
                        <ul>
                            <li class="fontColor" @click="handleDetail(item.id)" v-for="item in newData" :key="item.id">
                                <p class="newTitle singleLine">{{item.title }}</p>
                                <p class="newDate">{{item.updateTime}}</p>
                            </li>
                        </ul>
                    </div>
                    <!-- 分页 -->
                    <div class="poolPage">
                        <el-pagination background @size-change="handleSizeChange" @current-change="handleCurrentChange"
                            :current-page="params.page" :page-sizes="[10, 20, 30]" :page-size="params.pageSize"
                            layout="total, prev, pager, next" :total="total">
                        </el-pagination>
                    </div>
                </div>

            </div>
        </div>
        <Footer />
    </div>
</template>
<script>
import { newList } from "@/request/api/index"
import Header from "@/components/home/header/header";
import Footer from "@/components/home/footer/footer";
import {dateFormat} from "@/utils/dateFormat.js"
export default {
    components: {
        Header,
        Footer,
    },
    data() {
        return {
            params: {
                current: 1,
                pageSize: 10,
            },
            newData: [],
            total: 0,
            loading:true
        }
    },
    created() {
        this.getList()
    },
    methods: {
        // 获取列表
        getList() {
            newList(this.params).then(res => {
                this.loading=false
                if (res.data.code == 1) {
                    let dataList=res.data.data.totalList
                    dataList.forEach(item=>{
                        item.updateTime=dateFormat(item.updateTime)
                    })
                    this.newData = dataList
                    this.total = res.data.data.total
                } else {
                    this.newData = []
                }
            })
        },
        handleSizeChange(val) {
            this.params.pageSize = val;
            this.params.current = 1;
            this.getList();
        },
        handleCurrentChange(val) {
            this.params.current = val;
            this.getList();
        },
        // 详情
        handleDetail(id) {
            this.$router.push({
                name: "informationDetail",
                query: {
                    id,
                },
            });
        },
    }
}
</script>
<style lang="less" scoped>
@import "./information.less";
</style>

